<script lang="ts" setup name="procureSheet">
import { CirclePlus, Delete, FolderDelete } from '@element-plus/icons-vue'
import { ProTableInstance } from '~/library/components/ProTable/interface'
import { Procure } from '~/src/api/interface/procure'
import { cancelCheckProcureSheetAPI, deleteProcureSheetAPI, getProcureSheetAPI } from '~/src/api/procure'
import { ProcureSheetColumns } from './info/columns'

const proTableRef = ref<ProTableInstance>()
const router = useRouter()
const route = useRoute()

const toCreate = (id: string, status?: boolean) => {
  if (id) {
    router.push({
      path: '/procure/procureSheetEdit',
      query: {
        id: id,
        type: status ? 'audited' : 'edit',
      },
    })
  } else {
    router.push(`/procure/procureSheetEdit?type=add`)
  }
}

const deleteRow = async (params: Procure.ProcureSheet) => {
  await useHandleData(deleteProcureSheetAPI, { id: params.id }, `删除编号【${params.orderNo}】采购单`)
  proTableRef.value?.getTableList()
}

const onCancelCheck = async (params: Procure.ProcureSheet) => {
  await useHandleData(cancelCheckProcureSheetAPI, { id: params.id }, `反审核编号【${params.orderNo}】采购单`)
  // 获取表格刷新的方法
  proTableRef.value?.getTableList()
}

// const onCheck = async (params: Procure.ProcureSheet) => {
//   // 封装发请求的
//   await useHandleData(checkProcureSheetAPI, { id: params.id }, `审核编号【${params.orderNo}】采购单`)
//   proTableRef.value?.getTableList()
// }
</script>

<template>
  <div class="auto-height-container">
    <pro-table
      ref="proTableRef"
      :columns="ProcureSheetColumns"
      :indent="20"
      :isCard="false"
      :request-api="getProcureSheetAPI"
      row-key="id"
      title="采购单列表"
    >
      <template #tableHeader>
        <el-button v-auth="'add'" :icon="CirclePlus" type="primary" @click="toCreate('')">新增单据</el-button>
      </template>
      <template #orderNo="{ row }">
        <el-button text type="primary" @click="toCreate(row.id, row.checkFlag)">{{ row.orderNo }}</el-button>
      </template>
      <template #operation="scope">
        <el-button v-if="scope.row.checkFlag" v-auth="'uncheck'" :icon="FolderDelete" link type="primary" @click="onCancelCheck(scope.row)">
          反审核
        </el-button>
        <el-button v-if="!scope.row.checkFlag" v-auth="'delete'" :icon="Delete" link type="primary" @click="deleteRow(scope.row)">
          删除
        </el-button>
      </template>
    </pro-table>
  </div>
</template>

<style lang="scss" scoped></style>
